<template>
  <p>姓名：{{name}}, 公司：{{company}}, 月薪：{{salary}}, 年薪{{total}}</p>
  <button @click="double">月薪double</button>
</template>
<script>
import { ref, computed } from 'vue'
export default {
  name: 'App',
  setup () {
    // 定义响应式对象
    const company = ref('DiDi')
    const name = ref('小王')
    const salary = ref(20000)

    const double = () => {
		// 完成功能
        salary.value *= 2
    }
    // 完成功能
    const total = computed(() =>{
        return 12 * salary.value + '元'
    })
    
    return {  
      name, 
      company,
      total,
      salary,
      double
    }
  }
}
</script>
